<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <link rel="stylesheet" href="/febs/vue/element-ui-index.css" />
    <script src="/febs/vue/vue.js"></script>
    <script src="/febs/vue/axios.min.js"></script>
    <script src="/febs/vue/element-ui-index.js"></script>
    <script src="/febs/vue/jquery.js"></script>
  </head>

  <body>
    <div id="app" class="layui-fluid w-app">
      <el-form ref="form" :model="form" label-width="120px">
        <el-form-item label="单据类别">
          <el-input v-model="billstdNm" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="单据编号">
          <el-input v-model="form.orderNo" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="签核人员">
          <el-input v-model="form.toUserCname" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="签核角色">
          <el-input v-model="form.checkRole" :disabled="true"></el-input>
        </el-form-item>
        <!--          <el-form-item label="签核人员帐号">-->
        <!--              <el-input v-model="form.toUserNo" :disabled="true"></el-input>-->
        <!--          </el-form-item>-->
        <el-form-item label="送签人员">
          <el-input v-model="form.sendUserCname" :disabled="true"></el-input>
        </el-form-item>
        <!--          <el-form-item label="送签人员帐号">-->
        <!--              <el-input v-model="form.sendUserNo" :disabled="true"></el-input>-->
        <!--          </el-form-item>-->
        <el-form-item label="驳回理由" required>
          <el-input type="textarea" v-model="form.content" ></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onSubmit">立即驳回</el-button>
          <el-button @click="onCancel">取消</el-button>
        </el-form-item>
      </el-form>
    </div>
  </body>
  <script>
    new Vue({
      el: "#app",
      data() {
        return {
          form: {
            classify: "",
            orderNo: "",
            toUserCname: "",
            checkRole: "",
            toUserNo: "",
            sendUserCname: "",
            sendUserNo: "",
            content: "",
          },
          parameters: {},
          billstdNm: "",
        };
      },
      created() {
        // console.log('parameterReject',sessionStorage.parameterReject)
        const parameterRejects = JSON.parse(sessionStorage.parameterReject)[0];
        // console.log('parameterReject2',parameterRejects)
        //获取类别列表
        const that = this;
        axios
          .get("/baseflow/getList")
          .then(function (res) {
            const classifyList = res.data.data;
            const classifyItem = classifyList.find(function (aws) {
              return aws.billstdNo === parameterRejects.billstdNo;
            });
            if (classifyItem) {
              that.billstdNm = classifyItem.billstdNm;
              that.form.classify = classifyItem.billstdNo;
            }
          })
          .catch(function (error) {
            console.log(error);
          });
        this.form.orderNo = parameterRejects.orderNo;
        this.form.toUserCname = parameterRejects.toUserCname;
        this.form.checkRole = parameterRejects.flowDesc;
        this.form.toUserNo = parameterRejects.toUser;
        this.form.sendUserCname = parameterRejects.grtUserCname;
        this.form.sendUserNo = parameterRejects.grtUser;
        // $(".layui-layer").css("top",($(window).height() - 630)/2)
        // console.log('top',($(window).height() - 630)/2)
      },
      methods: {
        onSubmit() {
          if(this.form.content===""){
            this.$message.error("驳回理由:请填写驳回原因");
            return
          }
          axios
            .post("/reject/add", this.form)
            .then((response) => {
              $("#febs-approvals").find("#query").trigger("click");
              layer.closeAll();
            })
            .catch((error) => {
              console.log(error);
            });
          // .then(function(response){
          //   $("#febs-approvals").find("#query").trigger("click");
          //   layer.closeAll();
          // })
          // .catch(function(error){
          //   console.log(error);
          // });
        },
        onCancel() {
          layer.closeAll();
        },
      },
    });
  </script>

  <style>
    .w-app {
      display: flex;
      flex-direction: column;
      justify-content: center;
      text-align: center;
      font-size: 14px;
      padding: 0px 15px 15px 15px;
      background: #ffffff !important;
    }

    .text-center {
      text-align: center;
    }

    .text-left {
      text-align: left;
    }

    th,
    td {
      padding: 4px 4px;
    }

    .main-table,
    .main-table th,
    .main-table td {
      border-collapse: collapse;
      border: 1px solid #000;
    }

    .total > td {
      padding: 6px 4px;
    }

    .horizontal-sign {
      margin-top: 30px;
    }

    .sign {
      border-bottom: 1px solid #000;
      width: 200px;
    }

    .text-16px {
      font-size: 16px;
    }
  </style>
</html>
